<template>
  <Modal :transfer=false v-model="model4" :width=900>
    <Tabs>
      <TabPane label="历史记录">
        <Table ref='table1' border :columns="columns2" no-data-text="没有查询到相关数据！" style="margin-top: 0"
               :loading="loading2"
               :data="history" width="100%" :height="450" highlight-row stripe size="small"></Table>
      </TabPane>
      <TabPane label="流程图">
        <div style="height: 450px; overflow-y: auto; overflow-x: auto">
          <img :src="imgUrl">
        </div>
      </TabPane>
    </Tabs>
    <div slot="footer">
      <Button @click="model4=false" class="ivu-btn-save">关闭</Button>
    </div>
  </Modal>
</template>

<script>
import {Api} from "@/api";

export default {
  name: "flowChart",
  data() {
    return {
      loading2: false,
      model4: false,
      imgUrl: null,
      columns2: [
        {
          type: 'index',
          title: '序号',
          width: 80,
          align: 'center',
        },
        {
          width: 180,
          title: '审批时间',
          key: 'endTime',
          align: 'center',
        },
        {
          width: 185,
          title: '节点名称',
          key: 'name',
          align: 'center',
        },
        {
          width: 120,
          title: '审批人',
          key: 'userName',
          align: 'center'
        },
        {
          width: 100,
          title: '审批意见',
          key: 'route',
          align: 'center'
        },
        {
          width: 200,
          title: '备注',
          key: 'opinions',
          align: 'center'
        },
      ],
      history: [],

    }
  },
  mounted() {

  },
  methods: {
    showHistory(procinstId) {
      this.model4 = true;
      this.loading2 = true;
      this.imgUrl = Api.getFlowImg + '/' + procinstId
      this.$http.get(Api.getHistory + '/' + procinstId, {params: {}}).then((res) => {
        this.history = res.data;
        this.loading2 = false;
      }).catch(e => {
        this.$Message.error("数据获取失败")
      })
    },
  },
}
</script>

<style scoped>
@import '../../../index.css';
</style>
